<template>
  <div class="rightTwoLeftDiv">
    <div class="subTitle">全厂机组实时负荷（MW）</div>
    <img
      src="@/assets/images/right/subTitleImg.png"
      alt=""
      class="subTitleImg"
    />
    <div class="chartRighrTwoLeft">
      <RightOneLCharts :chartData="data"></RightOneLCharts>
    </div>
  </div>
</template>

<script>
import RightOneLCharts from "../components/rightOneLCharts.vue";
export default {
  data() {
    return {
      data: [
        {
          id: 1,
          title: "#1号机组",
          num: "9",
          rate: "5%",
          sort: "1",
        },
        {
          id: 2,
          title: "#2号机组",
          num: "23",
          rate: "14%",
          sort: "2",
        },
        {
          id: 3,
          title: "#3号机组",
          num: "13",
          rate: "8%",
          sort: "3",
        },
        {
          id: 4,
          title: "#4号机组",
          num: "76",
          rate: "46%",
          sort: "4",
        },
        {
          id: 5,
          title: "#5号机组",
          num: "44",
          rate: "27%",
          sort: "5",
        },
      ],
    };
  },
  components: {
    RightOneLCharts,
  },
  mounted() {},
  methods: {},
};
</script>

<style lang="scss" scoped>
.rightTwoLeftDiv {
  width: 100%;
  height: 100%;
  color: #fff;
  .chartRighrTwoLeft {
    width: 100%;
    height: 265px;
    margin-top: 34px;
  }
}
</style>
